{extend name="public:base"/}
{block name="style"}

{/block}
{block name="main"}

<!-- <link rel="stylesheet" type="text/css" href="__Com__/fileupload/css/jquery.fileupload.css"> -->

<form class="layui-form" action="" method="POST" >
  <div class="layui-form-item">
      <label class="layui-form-label">上级菜单</label>
      <div class="layui-input-block width-350"  >
         <select name="pid" lay-filter="select" >
          <option value="">一级菜单</option>
            {foreach $catelist as $k=>$v}
            <option value="{$v['cateid']}" {if condition="$info['pid'] eq $v['cateid'] "}selected="selected"{/if}>{$v['catename']}</option>
            {/foreach}
        </select>  
      </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">分类名称</label>
    <div class="layui-input-block  width-350">
      <input type="hidden" name="cateid" value="{$info['cateid']}">
      <input type="text" name="catename" lay-verify="required"  placeholder="请输入分类名称" autocomplete="off" class="layui-input" value="{$info['catename']}">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">关键字</label>
    <div class="layui-input-block  width-350">
      <input type="text" name="keyword"  placeholder="请输入分类关键字" autocomplete="off" class="layui-input" value="{$info['keyword']}">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">描述</label>
    <div class="layui-input-block  width-350">
      <input type="text" name="description"  placeholder="请输入分类描述" autocomplete="off" class="layui-input" value="{$info['description']}">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">排序</label>
    <div class="layui-input-inline width-350">
      <input type="number" name="catepx"  placeholder="请输入数字排序" autocomplete="off" class="layui-input" value="{$info['catepx']}">
    </div>
  </div>
  <div class="layui-form-item">
      <label class="layui-form-label">类型</label>
      <div class="layui-input-block width-350" >
        <select name="catetype"  lay-filter="test" id="catetype" >
         
          <option value="无">无</option>
          <option value="文章模型" {if condition="$info['catetype'] eq '文章模型'"}selected {/if}>文章模型</option>
          <option value="单页面" {if condition="$info['catetype'] eq '单页面'"}selected {/if}>单页面</option>
          <option value="跳转连接" {if condition="$info['catetype'] eq '跳转连接'"}selected {/if}>跳转连接</option>
            
        </select>   
      </div>
  </div>
  
  <!-- 单页模板列表 -->
  <div class="layui-form-item selectlist" id="templatepage" style="display:none;{if condition="$info['catetype'] eq '单页面'"}display:block;{/if}">
      <label class="layui-form-label">单页模板</label>
      <div class="layui-input-block width-350" >
        <select name="template">
         
          <option value="无">无</option>
          {foreach $pages[0] as $v}
              <option value="{$v}" {if condition="$v eq $info['template']"}selected{/if}>{$v}</option>
          {/foreach}
        </select>   
      </div>
  </div>

  <div class="layui-form-item selectlist"  id="templatelist" style="display:none;{if condition="$info['catetype'] eq '文章模型'"}display:block;{/if}">
      <label class="layui-form-label">列表页</label>
      <div class="layui-input-inline width-350" >
        <select name="template[]" >
          <option value="无">无</option>
          {foreach $pages[1] as $v}
              <option value="{$v}" {if condition="$v eq $info['template'][0]"}selected{/if}>{$v}</option>
          {/foreach}
        </select>   
      </div>
      <label class="layui-form-label">内容页</label>
      <div class="layui-input-inline width-350" >
        <select name="template[]"  lay-verify="required">
          <option value="无">无</option>
          {foreach $pages[2] as $v}
              <option value="{$v}" {if condition="$v eq $info['template'][1]"}selected{/if}>{$v}</option>
          {/foreach}
        </select>   
      </div>
  </div>
  <div class="layui-form-item selectlist" id="url" style="display:none;">
    <label class="layui-form-label">跳转连接</label>
    <div class="layui-input-block  width-350">
      <input type="text" name="url"  placeholder="请输入跳转连接" autocomplete="off" class="layui-input" value="{$info['url']}">
    </div>
  </div>
  <div class="layui-form-item">
     <label class="layui-form-label">缩略图</label>
     <div class="layui-input-inline  width-350" >
       <input type="text" name="catethumb"  placeholder="图片地址" autocomplete="off" class="layui-input"  value="{$info['catethumb']}">
       
     </div>
     <div class="layui-word-aux">
        {notempty name="info['catethumb']"}
        <img src="" class="content-photos">
        {else/}
        <img src="" class="content-photos" value="{$info['catethumb']}">
        {/notempty}
        
       <button type="button" class="layui-btn layui-btn-small" id="fileupload">
         <i class="layui-icon">&#xe60d;</i>上传图片
       </button>
     </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">备注</label>
    <div class="layui-input-block width-350">
      <input type="text" name="other" requplaceholder="请输入分类备注名称" autocomplete="off" class="layui-input" value="{$info['other']}">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">导航栏</label>
    <div class="layui-input-block">
      <input type="checkbox" name="isnav" lay-skin="switch" lay-text="显示|隐藏" lay-filter="switchTest" value="1" {if condition="($info['isnav'] eq '1') OR ($info['isnav'] eq '')"}checked=''{/if}>
      <div class="layui-unselect layui-form-switch" lay-skin="_switch">
        <em>OFF</em><i></i>
      </div>
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">状态</label>
    <div class="layui-input-block">
      <input type="checkbox" name="status" lay-skin="switch" lay-text="启用|禁用" lay-filter="switchTest" value="1" {if condition="($info['status'] eq '1') OR ($info['status'] eq '')"}checked=''{/if}>
      <div class="layui-unselect layui-form-switch" lay-skin="_switch">
        <em>OFF</em><i></i>
      </div>
    </div>
  </div>

  <div class="layui-form-item">
    <div class="layui-input-block">
      <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
  </div>
</form>

<script type="text/javascript">
	layui.use(['form','upload'], function(){
	  var form = layui.form;
    var upload=layui.upload

    //上传
    var uploadInst = upload.render({
        elem: '#fileupload' //绑定元素
        ,url: '{:Url('common/fileupload',array('width'=>"60",'height'=>"60"))}' //上传接口
        ,done: function(res){
           if(res.status=='1'){
             layui.$("input[name='catethumb']").val(res.path);
             $(".content-photos").attr("src",res.path);
             alert("上传成功~");
           }else{
            alert("上传失败~");
           }
        }
        ,error: function(){
          alert("上传失败~");
        },accept: 'images'
        ,field:'file'
        ,data:{type:'image'}
    });

    form.on('select(test)', function(data){

      $(".selectlist").hide();
      $(".selectlist").find("select").attr('disabled','true');
      if(data.value=='单页面'){
        $("#templatepage").show();
        $("#templatepage").find("select").attr('disabled',false);
      }else if(data.value=='跳转连接'){
        $("#url").show();
      }else if(data.value=='文章模型'){
        $("#templatelist").show();
        $("#templatelist").find("select").attr('disabled',false);
      }
     
    });  

    layer.photos({
      photos: 'div'
      ,anim: 5 
    }); 

	  form.verify({
	    title: function(value){
	      if(value.length < 1){
	        return '标题至少得1个字符';
	      }
	    }
	  });
	});
</script>

{/block}